test(markdownEditorUtils): add unit tests for pure utility functions#604
test(markdownEditorUtils): add unit tests for pure utility functions#604Shubh-Raj wants to merge 11 commits intoaccordproject:mainfrom
Conversation
Add comprehensive unit tests for markdownEditorUtils.ts pure functions: - parseLine: 6 tests for whitespace extraction - detectPrefix: 9 tests for markdown prefix detection - allLinesHavePrefix: 6 tests for prefix validation - createLineEditRange: 3 tests for range creation Also adds Monaco editor mock to enable testing utilities that import Monaco types without loading the full editor. Total new tests: 24 (repo total: 58) Signed-off-by: Shubh-Raj <shubhraj625@gmail.com>
✅ Deploy Preview for ap-template-playground ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
There was a problem hiding this comment.
Pull request overview
Adds Vitest unit coverage for the pure helper functions in src/utils/markdownEditorUtils.ts (used by the Markdown Toolbar feature) and introduces a lightweight monaco-editor mock so these utilities can be imported in tests without pulling in the full Monaco runtime.
Changes:
- Adds 24 unit tests covering
createLineEditRange,parseLine,detectPrefix, andallLinesHavePrefix. - Introduces a
monaco-editormodule mock for the unit-test environment. - Updates Vitest config to inline and alias
monaco-editorto the mock during tests.
Reviewed changes
Copilot reviewed 3 out of 3 changed files in this pull request and generated 1 comment.
| File | Description |
|---|---|
| vite.config.ts | Configures Vitest to alias monaco-editor to a test mock (and inline the dependency). |
| src/utils/testing/mocks/monaco-editor.ts | Provides a minimal Monaco mock (Selection + basic exports) to support importing editor utilities in unit tests. |
| src/tests/utils/markdownEditorUtils.test.ts | Adds unit tests for the pure utility functions powering markdown prefix/whitespace logic. |
…lias Signed-off-by: Shubh-Raj <shubhraj625@gmail.com>
| alias: { | ||
| "monaco-editor": fileURLToPath(new URL("./src/utils/testing/__mocks__/monaco-editor.ts", import.meta.url)), | ||
| }, |
There was a problem hiding this comment.
The Vitest config aliases the entire monaco-editor module to a local mock for all unit tests. This makes it hard to add future tests that rely on real Monaco behavior (or a richer mock) and can cause unrelated test failures when a component imports Monaco at runtime. Consider scoping the Monaco mocking to only the specific test(s) that need it (e.g., vi.mock('monaco-editor', ...) in the test file or in setup.ts with conditional logic), or alternatively remove the runtime Monaco import need by switching the util to import type (so no module-level Monaco load occurs during tests).
| alias: { | |
| "monaco-editor": fileURLToPath(new URL("./src/utils/testing/__mocks__/monaco-editor.ts", import.meta.url)), | |
| }, |
| export const editor = {}; | ||
|
|
There was a problem hiding this comment.
This mock currently exports only an empty editor object and a Selection class. Because the Vitest config aliases monaco-editor globally, any test that imports code using Monaco runtime APIs (e.g., monaco.languages.*, monaco.editor.*) will throw at runtime with this mock. Either expand the mock to include the minimal runtime shape used by the app (stub languages, editor, etc.), or avoid applying the alias globally and mock Monaco only in the tests that need it.
| export const editor = {}; | |
| /** | |
| * Minimal stub for the monaco.editor namespace used in tests. | |
| * Functions are no-ops that return simple disposable-like objects | |
| * to prevent runtime errors when test code calls Monaco APIs. | |
| */ | |
| export const editor = { | |
| create: (_domElement?: unknown, _options?: unknown) => { | |
| const model = { | |
| getValue: (): string => '', | |
| setValue: (_value: string): void => { | |
| // no-op | |
| }, | |
| dispose: (): void => { | |
| // no-op | |
| }, | |
| }; | |
| return { | |
| onDidChangeModelContent: ( | |
| _listener: () => void | |
| ): { dispose: () => void } => ({ | |
| dispose: (): void => { | |
| // no-op | |
| }, | |
| }), | |
| getValue: (): string => '', | |
| setValue: (_value: string): void => { | |
| // no-op | |
| }, | |
| getModel: () => model, | |
| updateOptions: (_options: unknown): void => { | |
| // no-op | |
| }, | |
| dispose: (): void => { | |
| // no-op | |
| }, | |
| }; | |
| }, | |
| createModel: (value: string, _language?: string) => ({ | |
| getValue: (): string => value, | |
| setValue: (_newValue: string): void => { | |
| // no-op | |
| }, | |
| dispose: (): void => { | |
| // no-op | |
| }, | |
| }), | |
| setModelLanguage: (_model: unknown, _languageId: string): void => { | |
| // no-op | |
| }, | |
| }; | |
| /** | |
| * Minimal stub for the monaco.languages namespace used in tests. | |
| */ | |
| export const languages = { | |
| register: (_language: unknown): void => { | |
| // no-op | |
| }, | |
| setMonarchTokensProvider: (_languageId: string, _tokensProvider: unknown): void => { | |
| // no-op | |
| }, | |
| registerCompletionItemProvider: ( | |
| _languageId: string, | |
| _provider: unknown | |
| ): { dispose: () => void } => ({ | |
| dispose: (): void => { | |
| // no-op | |
| }, | |
| }), | |
| }; |
Closes #603
Add comprehensive unit tests for the pure utility functions in markdownEditorUtils.ts to improve test coverage for the new Markdown Toolbar feature.
Changes
deps.inlineandaliasconfig to use the Monaco mock in testsFlags
Screenshots or Video
N/A - This is a test-only change with no UI modifications.
Related Issues
Author Checklist
--signoffoption of git commit.mainfromShubh-Raj:shubhraj/tests/markdowneditorutils-unit-tests